<!--
  数据列表
-->
<template>
  <div style="
  background-color: cadetblue;
    position: absolute;
    right: 0px;
    bottom: 0px;
    top: 0px;
    left: 0px;">
    <div style="width: 600px;">
      <!-- <PreviewGroup :group="group" /> -->
    </div>
  </div>
</template>

<script>
// 单图片缩略
import PreviewThumbnail from './../custom/vue-preview/PreviewThumbnail'
import PreviewGroup from './../custom/vue-preview/PreviewGroup'
import PreviewSlide from './../custom/vue-preview/PreviewSlide'
export default {
  data () {
    return { currentSlide: 0, group: [] }
  },
  mounted: function () {
    for (let i = 0; i < 10; i++) {
      this.group.push({
        imgsrc:
          'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1529404422046&di=64c7ee23805e5365421e52de2c6d1013&imgtype=0&src=http%3A%2F%2Fd.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fd53f8794a4c27d1e41123d4717d5ad6eddc43878.jpg',
        title: '图片1' + i,
        mw: 100,
        mh: 100
      })
      this.group.push({
        imgsrc:
          'https://images.pexels.com/photos/207301/pexels-photo-207301.jpeg?h=350&auto=compress&cs=tinysrgb',
        title: '图片2' + i,
        mw: 100,
        mh: 100
      })
    }
  },
  watch: {
    currentSlide () {
      console.log(this.currentSlide)
    }
  },
  methods: {
    click () {
      console.log(PreviewGroup)
      new PreviewGroup({propsData: {group: this.group, currentSlide: this.currentSlide}}).$mount().$appendTo('body')
    },
    log (msgs) {
      console.log(msgs)
    }
  },
  components: {
    PreviewThumbnail,
    PreviewGroup,
    PreviewSlide
  },
  // 组建接受的传入参数
  props: []
}
</script>
